<template>
  <BasicTabs v-model="tabname" :tabs="tabs"  @tabChange="tabsChange"> </BasicTabs>
</template>
<script setup lang="ts">
  import { TabPaneItem } from '@/components/ui/basic-tabs/types'
  import GroupStatus from '../components/tabComponents/groupStatus.vue'
  import FilterDetail from '../components/tabComponents/dustFiltration/filterDetail.vue'

  const tabname = ref()

  const tabs = shallowRef<TabPaneItem[]>([
    {
      name: '111510',
      label: '状态总览',
      roles: ['111510'],
      slots: { default: h(GroupStatus, { statusCode: '111510', processName: '滤尘' }) }
    },
    {
      name: '111520',
      label: '单机详情',
      roles: ['111520'],
      slots: { default: h(FilterDetail, { statusCode: '111520', processName: '滤尘' }) }
    }
  ])

  const tabsChange = (tab) => {
    console.log(tab)
  }
</script>
<style lang="scss"></style>
